<template>
  <div class="noticeDetails">
    <ul>
      <li class="noticeDetails-li h5-hairline--bottom">
        <span class="li-left">分类：</span>
        <span class="li-right">系统通知</span>
      </li>
      <li class="noticeDetails-li h5-hairline--bottom">
        <span class="li-left">时间：</span>
        <span class="li-right">{{messageInfo.createTime | parseTime('{y}-{m}-{d} {h}:{i}:{s}')}}</span>
      </li>
      <li class="noticeDetails-li">
        <span class="li-left">内容：</span>
        <span class="li-right">{{messageInfo.messageTitle}}</span>
        <p class="content">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{messageInfo.messageContent}}</p>
      </li>
    </ul>
  </div>
</template>
<script>
import * as api from '@/service/api'
export default {
  data () {
    return {
      loading: false,
      messageInfo: {}
    }
  },
  computed: {
    curId () {
      return this.$route.query.id
    }
  },
  created () {
    this.getMessageInfo()
  },
  methods: {
    async getMessageInfo () {
      try {
        let res = await api.getMessageInfo({
          id: this.curId
        })
        this.messageInfo = res.data
      } catch (e) {
        console.log(e)
      }
    }
  }
}
</script>
<style lang="scss">
.noticeDetails {
  // min-height: 100%;
  background-color: #fff;
  ul {
    padding: 28px;
  }
  &-li {
    padding: 22px 0;
  }
  .li-left,
  .content {
    font-size: 26px;
    color: #808080;
  }
  .li-right {
    color: $text-color;
  }
  .content {
    line-height: 38px;
    letter-spacing: 2px;
    padding: 30px 0 40px;
  }
}
</style>

